<style>
.banner {
  background: url(<%= @company.img_url.to_s %>) no-repeat;
  min-height: 600px;
  background-position: center;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  position: relative;
}
.img-circle{
  border-radius: 0% !important;
  height: 240px;
  width: 200px;
}
.mod_hang_qrcode_show_bg {
  width: 150px;
  height: 140px;
  margin: 10px auto 0;
  background-position: 0px 2px;
  background-repeat: no-repeat;
  -moz-background-size: 124px auto;
  background-size: 146px auto;
  background-image: url(<%= image_path @user_custom.wechat_img_url rescue '' %>)
}
.jdc_hang_qrcode .mod_hang_qrcode_show_bg { background-image: url(<%= image_path @user_custom.wechat_img_url rescue '' %>) }
</style>
<% Rails.logger.info '================'%>
<% Rails.logger.info AdminUser.all%>
<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60">
  <nav class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
      <div class="navbar-header" style="display: flex; align-items: center;">
      <%= image_tag @company.logo_url.to_s, style: 'width: 40px; height: 40px; margin-right: 5px;'%>
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
        <a class="navbar-brand" href="#myPage"><%= @company.name %></a> </div>
      <div class="collapse navbar-collapse" id="myNavbar">
        <ul class="nav navbar-nav navbar-right">
          <% @naviga_bars.each do |naviga_bar| %>
            <li class="active"><a href="#<%= naviga_bar.key%>"><%= naviga_bar.name %></a></li>
          <% end %>
        </ul>
      </div>
    </div>
  </nav>
  <!-- banner -->
  <div class="jumbotron banner">
    <div class="banner-content">
      <p>Want to Apply or Us Or Learn From Us</p>
      <a href="#about" class="btn btn-danger btn-lg">了解更多</a>
      <div class="clearfix"></div>
    </div>
  </div>
  <!-- /banner -->
  <!-- Our Priorities -->
  <div class="priority" id="priorities">
    <h3 class="slideanim text-center"><%= @naviga_bar_core_title %></h3>
    <div class="container">
      <%
=begin%>
 <div class="lines"> <span class="vertical-line slideanowl-wrapper-outerim"></span> <span class="horizontal-line slideanim"></span> <span class="small-vertical-line1 slideanim"></span> <span class="small-vertical-line2 slideanim"></span> </div>
<%
=end%>
      <div class="row">
        <% @technical_cores.each do |technical_core| %>
          <div class="col-sm-4 placeholder"> <img class="img-circle img-responsive slideanim" src="<%= technical_core.img_url.to_s %>" alt="Generic placeholder thumbnail" width="140" height="140">
            <h4 class="text-center slideanim"><%= technical_core.title %></h4>
            <p class="text-center slideanim"><%= technical_core.content %></p>
          </div>
        <% end %>
        <!-- /.col-xs-4 -->
      </div>
      <!-- /.row -->
    </div>
  </div>
  <!-- /Our Priorities -->

  <!-- Portfolio -->
  <div class="portfolios" id="portfolio">
    <h3><%= @company_case_tile %></h3>
    <div class="gallery-cursual slideanim">
      <!-- start content_slider -->
      <div id="owl-demo" class="owl-carousel text-center owl-theme" style="opacity: 1; display: block;">
        <div class="owl-wrapper-outer" style='overflow-x: scroll;'>
          <div class="owl-wrapper" style="width: max-content; left: 0px; display: block;">
            <% @company_cases.each do |company_case| %>
              <div class="owl-item" style="width: 275px;">
                <div class="item g1 popup-with-zoom-anim" href="#small-dialog<%= company_case.id %>">
                  <img class="lazyOwl img-responsive" alt="name" src="<%= company_case.regular %>" style="display: block; height: 200px">
                  <div class="caption">
                    <span class="glyphicon glyphicon-hand-up"></span>
                    <p>Click To Know More</p>
                  </div>
                </div>
              </div>
            <% end %>
          </div>
        </div>
      <!-- Pop-up -->
      <div class="caption-popup">
        <% @company_cases.each do |company_case| %>
          <div id="small-dialog<%=company_case.id%>" class="mfp-hide innercontent slideanim">
            <%= company_case.content.html_safe %>
          </div>
        <% end %>
      </div>
    </div>
  </div>
  <!-- /caption-popup -->
  <!-- Portfolio -->
  <!-- About-us -->
  <div class="about-us" id="about">
    <div class="container">
      <div class="row">
        <div class="col-sm-6 text-center slideanim about1">
          <h4><%= @about_us_tile %></h4>
          <hr>
          <%= @company.content.html_safe %>
          <a href="#contact" class="btn btn-danger btn-lg">Contact Us</a>
        </div>
        <div class="col-sm-6 slideanim about2">
          <!-- carousel -->
          <div id="myCarousel" class="carousel slide">
            <!-- Indicators -->
            <ol class="carousel-indicators">
              <% @carousels.each_with_index do |carousel, i| %>
                <li class="item<%= i + 1 %> <%= i == 0 ? 'active' : ''%>"></li>
              <% end %>
            </ol>
            <!-- Wrapper for slides -->
            <div class="carousel-inner" role="listbox">
              <% @carousels.each do |carousel| %>
                <div class="item <%= carousel.order_number == 1 ? 'active' : ''%>">
                  <a href='<%= carousel.jump_link.presence || 'javascript:void(0)' %>'><img src="<%= image_path carousel.img_url %>" alt="Corporate image" class="img-responsive"></a>
                  <div class="carousel-caption">
                    <h3><%= carousel.name %></h3>
                  </div>
                </div>
              <% end %>
            </div>
            <!-- Left and right controls -->
            <a class="left carousel-control" href="#myCarousel" role="button"> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#myCarousel" role="button"> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div>
          <!-- /carousel -->
        </div>
      </div>
    </div>
  </div>
  <!-- /About-us -->
  <!-- Team -->
  <div class="team" id="team">
    <div class="container">
      <h3 class="slideanim"><%= @team_title %></h3>
      <div class="row placeholders">
        <% @teams.each do |team| %>
          <div class="col-xs-6 col-sm-3 placeholder"> <img src="<%=team.avatar_url %>" width="200" height="200" class="img-responsive slideanim" alt="Generic placeholder thumbnail">
            <h5 class="slideanim"><%= team.name %></h5>
            <p class="slideanim"><%= team.work_job %></p>
            <%
=begin%>
 <div class="social-icons"> <a href="#"><span class="facebook"></span></a> <a href="#"><span class="twitter"></span></a> <a href="#"><span class="linkedin"></span></a> <a href="#"><span class="googleplus"></span></a> </div>
<%
=end%>
          </div>
        <% end %>
      </div>
    </div>
  </div>
  <!-- /Team -->
  <!-- Contact -->
  <div class="contact-us" id="contact">
    <div class="container">
      <h3 class="text-center slideanim"><%= @content_us_title %></h3>
      <div class="row">
        <div class="col-sm-8 col-sm-offset-2">
          <form id="build_conent_us" action="<%= build_content_us_web_homes_path %>" method="post" >
            <div class="row">
              <div class="col-sm-6 form-group slideanim">
                <input class="form-control" id="name" name="name" placeholder="名字" type="text" required="">
              </div>
              <div class="col-sm-6 form-group slideanim">
                <input class="form-control" id="phone" name="phone" placeholder="手机号" type="phone" required="">
              </div>
            </div>
            <textarea class="form-control col-sm-6 form-group slideanim" id="content" name="content" placeholder="内容" rows="5" required=""></textarea>
            <br>
            <div class="row">
              <div class="col-sm-12 form-group slideanim">
                <button class="btn btn-danger btn-lg" type="submit">提交</button>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
  <!-- /Contact -->
  <!-- Footer -->
  <footer class="footer-distributed">
    <div class="container">
      <div class="row">
        <div class="col-md-4 footer-left">
          <div class="footer-left-header">
            <p>网站地图</p>
          </div>
          <div class="footer-links">
            <div><a href="#myPage"><i class="glyphicon glyphicon-home"></i>
              <p>首页</p>
              </a></div>
            <div><a href="#priorities"><i class="glyphicon glyphicon-certificate"></i>
              <p>技术核心</p>
              </a></div>
            <div><a href="#portfolio"><i class="glyphicon glyphicon-modal-window"></i>
              <p>合作伙伴</p>
              </a></div>
            <div><a href="#about"><i class="glyphicon glyphicon-info-sign"></i>
              <p>关于我们</p>
              </a></div>
            <div><a href="#team"><i class="glyphicon glyphicon-user"></i>
              <p>团队</p>
              </a></div>
            <div><a href="#contact"><i class="glyphicon glyphicon-phone"></i>
              <p>联系我们</p>
              </a></div>
          </div>
        </div>
        <div class="col-md-4 footer-center">
          <div class="footer-center-header">
            <p>公司地址</p>
          </div>
          <div class="footer-info">
            <div> <i class="glyphicon glyphicon-map-marker"></i>
              <p><span><%= @company.address %></span></p>
            </div>
            <div> <i class="glyphicon glyphicon-earphone"></i>
              <p><%= @company.phone %></p>
            </div>
            <div> <i class="glyphicon glyphicon-envelope"></i>
              <p><a href="mailto:support@company.com"><%= @company.e_mail %></a></p>
            </div>
          </div>
        </div>
        <div class="col-md-4 footer-right">
          <p class="footer-company-about"> <span>公司简介</span> <%= @company.brief %> </p>
          <%
=begin%>
 <div class="social-icons"> <a href="#"><span class="facebook"></span></a> <a href="#"><span class="twitter"></span></a> <a href="#"><span class="linkedin"></span></a> <a href="#"><span class="googleplus"></span></a> </div>
<%
=end%>
        </div>
      </div>
      <hr>
      <%
=begin%>
 <div class="copyright">
        <p class="text-center">© 2022 Entrepreneur. All rights Reserved <a href="https://www.adminbuy.cn/" target="_blank">网页模板</a></p>
      </div>
<%
=end%>
      <a href="#myPage" title="To Top"><span class="glyphicon glyphicon-chevron-up"></span></a> </div>
  </footer>
  <!-- /Footer -->
  <!-- js for portfolio popup -->
<script src="/demos/googlegg.js"></script>

<div class="jdc-side" style="display: block;">
  <!-- <div class="mod_hang_qrcode jdc_feedback_qrcode">
    <div class="mod_hang_qrcode_btn"><i class="jdcfont"></i><span>扫码反馈</span></div>
    <div class="mod_hang_qrcode_show">
      <div class="mod-qr-tips"></div>
      <div class="mod_hang_qrcode_show_bg">
        <div id="canvas" style="height: 123px; width: 123px;"><img src="<%= image_path 'qr_img.png'%>"></div>
      </div>
      <p>扫一扫，反馈当前页面</p>
    </div>
  </div> -->
  <div class="mod_hang_appeal">
    <div class="mod_hang_appeal_btn"><i class="jdcfont"></i> <span>咨询反馈</span></div>
    <div class="mod_hang_appeal_show">
      <ul>
        <li><a href="tel:13889458941">
          <div class="icon_box"><i class="jdcfont"></i></div>
          <div class="text_box">
            <h5>人工服务</h5>
            <p>7*12 专业人员，服务咨询</p>
          </div>
          </a>
        </li>

        <li><a href="#contact" class="f-cb">
          <div class="icon_box"><i class="jdcfont"></i></div>
          <div class="text_box">
            <h5>留言建议</h5>
            <p>倾耳聆听，一个工作日内及时处理</p>
          </div>
          </a>
        </li>
      </ul>
    </div>
    </div>
  <div class="mod_hang_qrcode jdc_hang_qrcode"><a class="mod_hang_qrcode_btn"><i class="jdcfont"></i><span>扫码关注</span></a>
    <div class="mod_hang_qrcode_show">
      <div class="mod_hang_qrcode_show_bg"></div>
      <p>扫码加微信</p>
    </div>
  </div>
  <div class="mod_hang_qrcode mod_hang_top"><a href="#" class="mod_hang_qrcode_btn"><i class="jdcfont"></i><span>返回顶部</span></a></div>
  <div class="el-dialog__wrapper" style="display: none;">
    <div class="el-dialog el-dialog--small" style="top: 15%;">
      <div class="el-dialog__header"><span class="el-dialog__title"></span>
        <div type="button" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></div>
      </div>
      </div>
  </div>
</div>

<script>
  $(document).ready(function() {
    $('.popup-with-zoom-anim').magnificPopup({
      type: 'inline',
      fixedContentPos: false,
      fixedBgPos: true,
      overflowY: 'auto',
      closeBtnInside: true,
      preloader: false,
      midClick: true,
      removalDelay: 300,
      mainClass: 'my-mfp-zoom-in'
    });
  });
</script>
<!-- /js for portfolio popup -->

<!-- carousel -->
<script>
$(document).ready(function(){
  // Activate Carousel
  $("#myCarousel").carousel({interval: 2000, pause: "hover"});

  // Enable Carousel Indicators
  $(".item1").click(function(){
    $("#myCarousel").carousel(0);
  });
  $(".item2").click(function(){
    $("#myCarousel").carousel(1);
  });
  $(".item3").click(function(){
    $("#myCarousel").carousel(2);
  });
  $(".item4").click(function(){
    $("#myCarousel").carousel(3);
  });

  // Enable Carousel Controls
  $(".left").click(function(){
    $("#myCarousel").carousel("prev");
  });
  $(".right").click(function(){
    $("#myCarousel").carousel("next");
  });
});
</script>
<!-- /carousel -->
<!-- nav sliding -->
<script>
  $(document).ready(function(){
    console.log(12313211111)
    //将平滑滚动添加到导航栏+页脚链接中的所有链接
    $(".navbar a, footer a[href='#myPage']").on('click', function(event) {  // Store hash
      var hash = this.hash;  //使用jQuery的animate（）方法添加平滑页面滚动
    //可选数字（900）指定滚动到指定区域所需的毫秒数
      $('html, body').animate({
      scrollTop: $(hash).offset().top
      }, 900, function(){    //完成滚动后，将哈希（#）添加到URL（默认单击行为）
        window.location.hash = hash;
      });
    });
  })
</script>
<!-- /nav sliding -->`
<!-- js for slideanim -->
<script>
  $(window).scroll(function() {
    $(".slideanim").each(function(){
      var pos = $(this).offset().top;
      var winTop = $(window).scrollTop();
      if (pos < winTop + 600) {
        $(this).addClass("slide");
      }
    });
  });
  $('.caption-popup').find('img').css('width', '100%')
</script>

</body>



